<template>
	<div id="app"><router-view v-if="routerState" /></div>
</template>
<script>
import Vue from 'vue'
import UniSocket from '@/utils/uni.socket.js'
import config from '@/utils/config.js'
export default {
	provide() {
		return {
			reload: this.reload
		};
	},
	data() {
		return {
			symbolsArray: [
				{ symbol: 'btcusdt', title: 'BTC/USDT' },
				{ symbol: 'ethusdt', title: 'ETH/USDT' },
				{ symbol: 'eosusdt', title: 'EOS/USDT' },
				{ symbol: 'crousdt', title: 'CRO/USDT' },
				{ symbol: 'trxusdt', title: 'TRX/USDT' }
			],
			routerState: true
		};
	},
	created() {
		this.init();
	},
	mounted() {
		let vh = window.innerHeight * 0.01;
		// Then we set the value in the --vh custom property to the root of the document
		document.documentElement.style.setProperty('--vh', `${vh}px`);

		const baseSize = 32;
		function setRem() {
			const scale = document.documentElement.clientWidth / 375;
			document.documentElement.style.fontSize = baseSize * Math.min(scale, 2) + 'px';
		}
		setRem();
		window.addEventListener('resize', () => {
			setRem();

			let vh = window.innerHeight * 0.01;
			//console.log(vh);
			document.documentElement.style.setProperty('--vh', `${vh}px`);
		});

		document.documentElement.addEventListener(
			'touchstart',
			function(event) {
				if (event.touches.length > 1) {
					event.preventDefault();
				}
			},
			false
		);
	},

	methods: {
		reload() {
			this.routerState = false;
			this.$nextTick(() => {
				this.routerState = true;
			});
		},
		init() {
			console.log('关闭unisocket')
			// Vue.prototype.$socket = new UniSocket({
			//     url: this.$wsUrl,
			// 	reconnectionTryNum: 3,
			// 	autoEmitBuffer: true,
			// 	// heartRate: 30000,
			// 	heartRate: 10000,
			// 	heartRateType: 'heart',
			// 	// token: store.getters.token,
			// })
			
			let Interval = setInterval(async () => {
				clearInterval(Interval);
				this.symbolsArray = await this.initMarketInfo();
				this.loadTopMarket();
			}, 300);
			
			
			
			/*
			this.$store.dispatch('WEBSOCKET_INIT', 'ws://43.129.78.82:1010');
			let Interval = setInterval(async () => {
				if (this.$store.state.websocket.is_open_socket) {
					this.symbolsArray = await this.initMarketInfo();
					this.loadTopMarket();
					clearInterval(Interval);
				}
				// console.log(
				//   this.$store.state.websocket.is_open_socket,
				//   "websocket连接状态"
				// );
			}, 300);*/
		},
		// 获取首页滑动数据
		async initMarketInfo() {
			const result = await new Promise(resolve => {
				$postAxios(api.getMarket, {}, res => {
					if (res.code == 0) {
						let arr = res.data.map(item => {
							let obj = {
								symbol: item.is_ft ? String(item.code).toUpperCase() : String(item.EN_name).toLowerCase() + 'usdt',
								title: item.is_ft ? item.EN_name : item.EN_name + '/USDT'
							};
							return obj;
						});
						resolve(arr);
					} else {
						this.$toast(this.$t(res.msg));
					}
				});
			});
			return result;
		},
		//  最新市场概要快照
		loadTopMarket() {
			let ids = [];
			this.symbolsArray.forEach(item => {
				ids.push(item.symbol);
				/*
				let ch = `market.${item.symbol}.detail`;
				let data = {
				  sub: ch,
				  id: Date.now() + "",
				};
				// 发送消息
				this.$store.dispatch("WEBSOCKET_SEND", JSON.stringify(data));
				let ch2 = `market.${item.symbol}.trade.detail`;
				let data2 = {
				  sub: ch2,
				  id: "id1",
				};
				this.$store.dispatch("WEBSOCKET_SEND", JSON.stringify(argumentsdata2));*/
			});
			console.log('全局订阅listddd')
			// this.$socket.on('sub.futures.list@global', this.revData, false, {ids: ids})
			// this.$store.dispatch('WEBSOCKET_SEND', JSON.stringify({event: 'sub.futures.list', data: {ids: ids}}));
		},
		revData() {
			// console.log(res)
		}
	}
};
</script>

<style lang="scss">
#app {
	font-family: PingFang SC;
	width: 100%;
	margin: 0 auto;
	min-height: 100%;
	height: calc(var(--vh, 1vh) * 100);
	position: relative;
	overflow: hidden;
	-webkit-overflow-scrolling: touch;
}

%clear-float {
	&:after {
		display: block;
		content: 'clear';
		height: 0;
		clear: both;
		overflow: hidden;
		visibility: hidden;
	}
}

@mixin line($line: 1) {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: $line;
	overflow: hidden;
	word-break: break-all;
}
</style>
